import React, { lazy, Suspense } from 'react'
import { useRoutes, Navigate } from 'react-router-dom'
import Home from '../pages/home/Index'
import Archives from '../pages/home/Archives/Index'
import Articles from '../pages/home/Articles/Index'
import KnowledgeBooks from '../pages/home/KnowledgeBooks/Index'
import Login from '../pages/home/Login'
import Details from '../pages/home/Detail/Index'
import HomeRightTabDetail from '../pages/home/Detail/HomeRightTabDetail'
<<<<<<< HEAD
=======

>>>>>>> ed0b2c250a90019fa0ec18981e2083c04c7162b6
type Props = {}
const routerItem = [
  {
    path: '/home/Articles',
    meta: {
      title: 'Articles'
    },
    element: <Articles></Articles>
  },
  {
    path: '/home/Archives',
    meta: {
      title: 'Articles'
    },
    element: <Archives></Archives>
  },
  {
    path: '/home/KnowledgeBooks',
    meta: {
      title: 'Articles'
    },
    element: <KnowledgeBooks></KnowledgeBooks>
  },
  {
    path: '/home/Details/:id',
    meta: {
      title: 'Articles'
    },
    element: <Details></Details>
  },
  {
    path: '/home/HomeRightTabDetail/:id',
    meta: {
      title: 'Articles'
    },
    element: <HomeRightTabDetail></HomeRightTabDetail>
  },
]
const routers = [
  {
    path: '/',
    element: <Navigate to={'/home/Articles'}></Navigate>
  },
  {
    path: '/home',
    element: <Home></Home>,
    children: routerItem
  },
  {
    path: '/login',
    element: <Login></Login>,
  
  },
]

const RouterConfig = (props: Props) => {
  //Suspense 的fallback 属性 直接代替了lazyload
  return <Suspense fallback={<>路由加载中。。。。。</>}>{useRoutes(routers)}</Suspense>
}

export default RouterConfig
